   /*-------------- Canvas framework ---------------*/
   /*   Document   : tester.js
    *   Created on : 24-jul-2013
    *   Author     : Blue king
    *   Description: Initiation on HTML5 canvas using easelJS
    */
    var stage;
    var spriteSheet;
    var bmpSeq;
 

    function init(){
           stage = new createjs.Stage("canvas");
           createjs.Ticker.useRAF = true; //use requestAnimationFrame();

           
           var data = {
            images: ["images/runR.png"],
            frames: {width:36, height:45, regX:18, regY:22},
            animations: {run:[0,5],run2:[6,11]}
           };
           
           spriteSheet = new createjs.SpriteSheet(data);
           createjs.SpriteSheetUtils.addFlippedFrames(spriteSheet,true,false);
           anim(spriteSheet);
           
           createjs.Ticker.addEventListener("tick", tick4);
       }

    


     


function tick4(){
    var isStopped = 0;
    
    if((stage.mouseX < bmpSeq.x) && !(stage.mouseX > bmpSeq.x+10)){
        bmpSeq.x = bmpSeq.x - bmpSeq.vX;
            if(!(bmpSeq.currentAnimation === "run2"))
                bmpSeq.gotoAndPlay("run2");
            else if(bmpSeq.paused)
                bmpSeq.gotoAndPlay("run2");
    }else{
        isStopped++;
    }
    if((stage.mouseY < bmpSeq.y) && !(stage.mouseY > bmpSeq.y+10)){
        bmpSeq.y = bmpSeq.y - bmpSeq.vY;
        if(bmpSeq.paused)
            bmpSeq.play();
    }else{
        isStopped++;
    }
    if((stage.mouseX > bmpSeq.x) && !(stage.mouseX < bmpSeq.x+10)){
        bmpSeq.x = bmpSeq.x + bmpSeq.vX;
            if(!(bmpSeq.currentAnimation === "run"))
                bmpSeq.gotoAndPlay("run");
            else if(bmpSeq.paused)
                bmpSeq.gotoAndPlay("run");
    }else{
        isStopped++;
    }
    if((stage.mouseY > bmpSeq.y) && !(stage.mouseY < bmpSeq.y+10)){
        bmpSeq.y = bmpSeq.y + bmpSeq.vY;
        if(bmpSeq.paused)
            bmpSeq.play();
    }else{
        isStopped++;
    }
    if(isStopped === 4){
        if(bmpSeq.currentAnimation === "run")
            bmpSeq.gotoAndStop("run");
        else
            bmpSeq.gotoAndStop("run2");
    }
    stage.update();
}


function anim(spriteSheet){
bmpSeq = new createjs.BitmapAnimation(spriteSheet);
bmpSeq.vX = 10;
bmpSeq.vY = 10;
bmpSeq.x = 50;
bmpSeq.y = 50;
stage.addChild(bmpSeq);
bmpSeq.gotoAndPlay("run"); 
}